﻿<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>网站名称</title>
  <link rel="stylesheet" type="text/css" href="css/font-awesome.min.css" />
  <link rel="stylesheet" type="text/css" href="css/share.min.css" />
  <link rel="stylesheet" type="text/css" href="css/style.css" />
  <!--[if lt IE 9]>
  <script>self.location="browser/upgrade.html";</script>  
  <![endif]-->
</head>

<body class="bj-main">
  <div id="app">
    <div class="headern">
      <div class="top">
        <div class="container">
          <div class="fl"><a href="#">返回首页</a> | 欢迎来到数字资源管理系统</div>
          <div class="fr"><a href="#">登录</a> | <a href="#">注册</a></div>
        </div>
      </div>
      <div class="head">
        <div class="container">
          <div class="logo"><a href="/"><img src="img/logo.png"/></a></div>
          <form action="">
            <div class="box-search">
              <select name="way">
                <option value="all">全文</option>
                <option value="title">标题</option>
              </select>
              <input type="text" name="keywords" autocomplete="off" placeholder="全球治理 一带一路 宏观经济 甲骨文 群体事件"/>
              <input type="submit" value="搜索"/>
            </div>
          </form>
        </div>
      </div>
      <div class="container">
        <div class="nav">
          <ul class="clearfix">
            <li class="cur"><a href="#">首页</a></li>
            <li><a href="#">图书库</a></li>
            <li><a href="#">辞书库</a></li>
            <li><a href="#">视频库</a></li>
            <li><a href="#">专家库</a></li>
            <li><a href="#">报刊库</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="container">
      <div class="sys-main clearfix">
        <div class="sys-position">当前位置：<a href="#">首页</a> > 资源列表</div>
        <div class="sys-main-fl">
          <div class="list-box">
            <div class="tit"><span>热门专家</span></div>
            <ul class="xun-expert">
              <li><a href="#" class="pic"><img src="img/tu10.jpg"/></a><div class="info"><a href="#" class="bt">王伟光</a><p>中国社会科学院数量经济与技术经济研究所</p><p><a href="#">中国建设制造强国论</a></p></div></li>
              <li><a href="#" class="pic"><img src="img/tu10.jpg"/></a><div class="info"><a href="#" class="bt">王伟光</a><p>中国社会科学院数量经济与技术经济研究所</p><p><a href="#">中国建设制造强国论</a></p></div></li>
              <li><a href="#" class="pic"><img src="img/tu10.jpg"/></a><div class="info"><a href="#" class="bt">王伟光</a><p>中国社会科学院数量经济与技术经济研究所</p><p><a href="#">中国建设制造强国论</a></p></div></li>
              <li><a href="#" class="pic"><img src="img/tu10.jpg"/></a><div class="info"><a href="#" class="bt">王伟光</a><p>中国社会科学院数量经济与技术经济研究所</p><p><a href="#">中国建设制造强国论</a></p></div></li>
              <li><a href="#" class="pic"><img src="img/tu10.jpg"/></a><div class="info"><a href="#" class="bt">王伟光</a><p>中国社会科学院数量经济与技术经济研究所</p><p><a href="#">中国建设制造强国论</a></p></div></li>
              <li><a href="#" class="pic"><img src="img/tu10.jpg"/></a><div class="info"><a href="#" class="bt">王伟光</a><p>中国社会科学院数量经济与技术经济研究所</p><p><a href="#">中国建设制造强国论</a></p></div></li>
              <li><a href="#" class="pic"><img src="img/tu10.jpg"/></a><div class="info"><a href="#" class="bt">王伟光</a><p>中国社会科学院数量经济与技术经济研究所</p><p><a href="#">中国建设制造强国论</a></p></div></li>
            </ul>
          </div>
        </div>
        <div class="sys-main-fr">
          <div class="list-search">
            <div class="search-default">
              <span>结果中搜索：</span>
              <div class="box">
                <select name="way" v-model="search.way">
                  <option value="">全部</option>
                  <option value="title">标题</option>
                  <option value="author">作者</option>
                </select>
                <input type="text" name="keywords" v-model="search.keywords" autocomplete="off" placeholder="请输入内容"/>
              </div>
              <div class="but"><a href="javascript:;" @click="searchSubmit">检索</a><a href="javascript:;" @click="searchReset">清空</a></div>
            </div>
            <div class="screen-letter">
              <div class="fl">首字母筛选：</div>
              <div class="fr"><span v-for="item in letterList" :class="{cur:search.letter==item}" @click="letterChange(item)">{{item}}</span></div>
            </div>
          </div>
          <ul class="list-expert">
            <li v-for="item in dataList"><a :href="item.url" class="pic"><img :src="item.img"/><div class="hide"><p>简介：</p><p>{{item.desc}}</p></div></a><a :href="item.url" class="bt">{{item.name}}</a><p class="desc"><em>所属机构：</em>{{item.jigou}}</p><p class="desc"><em>研究方向：</em>{{item.yanjiu}}</p></li>
          </ul>
          <div class="pagebar">
            <a href="#">&lt;</a>
            <span class="cur">1</span>
            <a href="#">2</a>
            <a href="#">3</a>
            <a href="#">4</a>
            <a href="#">5</a>
            <a href="#">6</a>
            <a href="#">7</a>
            <a href="#">8</a>
            <a href="#">&gt;</a>
            <div class="gobox">跳转至<input type="text" value="1"/>页</div>
            <span>共 701 页</span>
          </div>
        </div>
      </div>
    </div>
    <div class="footer">
      <div class="container">
        <div class="content">
          <div class="logo"><img src="img/logo.png"/></div>
          <ul>
            <li><i class="fa fa-phone"></i>010-84883678</li>
            <li><i class="fa fa-envelope"></i>136983991@qq.com</li>
            <li><i class="fa fa-map-marker"></i>北京市东城区朝阳门内南小街51号</li>
          </ul>
        </div>
        <div class="nav">
          <div class="tit">快速链接</div>
          <ul class="er">
            <li><a href="#">关于我们</a></li>
            <li><a href="#">信息公告</a></li>
            <li><a href="#">客服中心</a></li>
            <li><a href="#">版权公告</a></li>
            <li><a href="#">在线咨询</a></li>
          </ul>
        </div>
        <div class="nav">
          <div class="tit">网站群</div>
          <ul>
            <li><a href="#">语文出出版社</a></li>
            <li><a href="#">数字语文资源网</a></li>
            <li><a href="#">中华人民共和国教育部</a></li>
          </ul>
        </div>
      </div>
      <div class="copy">
        <div class="container">版权所有：语文出版社 <a href="#">京ICP备11009062号-6</a></div>
      </div>
    </div>
  </div>
  <!-- 开发环境版本，包含了有帮助的命令行警告 -->
  <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
  <!-- 生产环境版本，优化了尺寸和速度 -->
  <!-- <script src="https://cdn.jsdelivr.net/npm/vue@2"></script> -->
  <script type="text/javascript" src="js/browser.min.js"></script>
  <script type="text/javascript" src="js/polyfill.min.js"></script>
  <script type="text/javascript" src="js/jquery.min.js"></script>
  <script type="text/javascript" src="js/layer/layer.js"></script>
  <script type="text/javascript" src="js/SuperSlide.js"></script>
  <script type="text/javascript" src="js/axios.min.js"></script>
  <script type="text/javascript" src="js/module/list_expert.js" type="text/babel"></script>
</body>

</html>